<template>
  <div>
    <list ref="list"
          v-if="totalPages"
          :showRefresh="true"
          :showLoadMore="showLoadMore"
          @refresh="refresh"
          @loadMore="loadmore"
          loadmoreoffset="200">
      <cell v-for="(item, index) in insurances"
            :key="index"
            @click="goDetail(item)">
        <div class="bg-white border-bottom p-3">
          <text class="title">单号：{{item.insurance_order_no}} 险种：{{item.insurance_class_name}}</text>
          <text class="desc">保费：{{item.ins_fee}} 保额：{{item.ins_funds}} </text>
          <text class="remark">保期：{{item.dateArea}}</text>
        </div>
      </cell>
    </list>
    <vm-status v-else
               :type="statusType"></vm-status>
  </div>
</template>
<script>
import VmButton from '../../components/vm-button.vue'
import VmStatus from '../../components/vm-status.vue'
import {
  STORAGE_FARM
} from '../../plugins/constant'

export default {
  components: { VmButton, VmStatus },
  props: {},
  data() {
    return {
      insurances: [],
      params: {
        index: 1,
        size: 10,
        'customer_id.eq': '',
        'insurance_order_no.neq': ''
      },
      totalPages: 2
    }
  },
  computed: {
    showLoadMore() {
      return this.totalPages > this.params.index
    },
    statusType() {
      return this.totalPages === -1 ? 'error' : 'empty'
    }
  },
  watch: {},
  eros: {
    beforeBackAppear(params) {
      if (params && params.type === 1) {
        this.refresh()
      }
    }
  },
  created() {
    this.getFarmInfo()
  },
  methods: {
    getFarmInfo() {
      this.farm = this.$storage.getSync(STORAGE_FARM) || {}
      if (this.farm.id) {
        this.params['customer_id.eq'] = this.farm.id
        this.refresh()
      }

      this.$navigator.setRightItem({
        text: '添加'
      }, this.onAdd)
    },
    refresh() {
      this.params.index = 1
      this.getInsurance().then(res => {
        this.insurances = res
      })
    },
    loadmore() {
      this.getInsurance().then(res => {
        this.insurances.push(...res)
      })
    },
    getInsurance() {
      return new Promise((resolve, reject) => {
        this.$api.getData({
          server: 'credit',
          table: 'datum_customer_insurance_order',
          params: this.params,
          order: {
            create_time: 'desc'
          },
          empty: false, // 是否过滤params的空值,
          errorMsg: '获取保单失败！'
        }).then(res => {
          this.params.index++
          this.totalPages = res && res.totalPages || 0
          const data = res && res.data || []
          resolve(data.map(item => {
            item.dateArea = `${this.pureTime(item.start_time)} ~ ${this.pureTime(item.end_time)}`
            return item
          }))
        }).catch(err => {
          this.totalPages = -1
        }).then(() => {
          const ref = this.$refs["list"]
          ref.refreshEnd()
          ref.loadMoreEnd()
        })
      })
    },
    pureTime(time) {
      return time ? time.substr(0, 10) : ''
    },
    onAdd() {
      this.$nav.open({ name: 'serve.insurance.apply' })
    },
    goDetail(row) {
      this.$nav.open({
        name: 'serve.insurance.apply',
        params: { data: row }
      })
    }
  }
}
</script>
<style lang="scss" scoped>
@import "../../css/variables.scss";
.p-3 {
  padding: 30px;
}
.bg-white {
  background-color: #fff;
}
.border-bottom {
  border-bottom-width: 1px;
  border-bottom-color: $border-color;
}
</style>
